<script setup>
import emitter from '@/utils/pubsub'

let firstLoad = true
onMounted(() => {
  const io = new IntersectionObserver(entries => {
    if (firstLoad) {
      firstLoad = false
      return
    }
    entries.forEach(entry => {
      emitter.emit('observe-view', entry)
    })
  })
  const elements = document.querySelectorAll('.observe-view')
  elements.forEach(ele => {
    io.observe(ele)
  })
})



</script>

<template>
  <div class="layout">
    <NavBar></NavBar>
    <main class="w-full">
      <slot />
    </main>
    <PageFooter />
  </div>
</template>

<style scoped>
.layout {
    width: 100vw;
    min-width: 1200px !important;
    @apply flex flex-col min-h-screen;
}
</style>
